<template>
    <div>
        <Row :gutter="15">
            <Col span="8">
                <div>
                    <div class="title">
                        <Row type="flex" justify="space-between" class="code-row-bg">
                            <Col span="17"><span class="option-title">项目监督</span></Col>
                            <Col span="2"><Icon type="md-arrow-round-forward" /></Col>
                        </Row>
                    </div>
                    <div class="classification">项目分类汇总</div>
                    <div class="classification">项目明细</div>
                </div>
            </Col>
            <Col span="8">
                <div>
                    <div class="title">
                        <Row type="flex" justify="space-between" class="code-row-bg">
                            <Col span="17"><span class="option-title">资金监督</span></Col>
                            <Col span="2"><Icon type="md-arrow-round-forward" /></Col>
                        </Row>
                    </div>
                    <div class="center">区直部门补贴</div>
                    <div class="center">部门经费</div>
                    <div class="center">村级财务公开</div>
                </div>
            </Col>
            <Col span="8">
                <div>
                    <div class="title">
                        <Row type="flex" justify="space-between" class="code-row-bg">
                            <Col span="17"><span class="option-title">一卡通</span></Col>
                            <Col span="2"><Icon type="md-arrow-round-forward" /></Col>
                        </Row>
                    </div>
                    <div class="center">一卡通补贴汇总（按街道）</div>
                    <div class="center">一卡通补贴汇总（按项目）</div>
                    <div class="center">一卡通补贴明细</div>
                </div>
            </Col>
        </Row>
    </div>
</template>

<script>
export default {
  name: 'SiteFoot',
  props: {
    option: {
      type: Object,
      default: () => {
        return {
          title: ''
        }
      }
    }
  },
  data () {
    return {}
  },
  methods: {
  },
  mounted () {

  }
}
</script>

<style scoped lang="less">
    .title{
        border-top: 3px #0166b6 solid;
        height: 50px;
        font-weight: bolder;
        background-color: #ebebeb;
        font-size: 20px;
        line-height: 50px;
        color: #0166b6;
    }
    .option-title{
        margin-left: 10px;
    }
    .classification{
        margin-top: 20px;
        height: 120px;
        background-color: #ebebeb;
        font-size: 20px;
        text-align: center;
        line-height: 120px;
        border-radius: 10px;
        font-weight: bolder;
        color: black;
    }
    .center{
        margin-top: 20px;
        height: 73px;
        background-color: #ebebeb;
        font-size: 20px;
        text-align: center;
        line-height: 73px;
        border-radius: 10px;
        font-weight: bolder;
        color: black;
    }
</style>
